/**
 * 移除并销毁loading
 * 放在这里是而不是放在 index.html 的app标签内，是因为这样比较不会生硬，渲染过快可能会有闪烁
 * 通过先添加css动画隐藏，在动画结束后在移除loading节点来改善体验
 * 不好的地方是会增加一些代码量
 * 自定义loading可以见：https://doc.vben.pro/guide/in-depth/loading.html
 */
export function unmountGlobalLoading() {
    // 查找全局 loading 元素
    const loadingElement = document.querySelector('#__app-loading__');

    if (loadingElement) {
        // 添加隐藏类，触发过渡动画
        loadingElement.classList.add('hidden');

        // 查找所有需要移除的注入 loading 元素
        const injectLoadingElements = document.querySelectorAll(
            '[data-app-loading^="inject"]',
        );

        // 当过渡动画结束时，移除 loading 元素和所有注入的 loading 元素
        loadingElement.addEventListener(
            'transitionend',
            () => {
                loadingElement.remove(); // 移除 loading 元素
                injectLoadingElements.forEach((el) => el.remove()); // 移除所有注入的 loading 元素
            },
            {once: true},
        ); // 确保事件只触发一次
    }
}
